<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>修改友情链接 - 听到微笑的博客</title>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/style.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/fileinput.min.css">
<link rel="apple-touch-icon-precomposed" href="${pageContext.request.contextPath }/images/icon/icon.png">
<link rel="shortcut icon" href="${pageContext.request.contextPath }/images/icon/favicon.ico">
<script src="${pageContext.request.contextPath }/js/jquery-2.1.4.min.js"></script>
</head>

<body class="user-select">
	<section class="container-fluid">
		<jsp:include page="common/top.jsp"></jsp:include>
		<div class="row">
			<jsp:include page="common/left.jsp"></jsp:include>
			<div class="col-sm-9 col-sm-offset-3 col-md-10 col-lg-10 col-md-offset-2 main" id="main">
				<div class="row">
					<form action="${pageContext.request.contextPath }/flink/update.action" method="post" class="add-flink-form" autocomplete="off" draggable="false">
						<input name="id" type="hidden" value="${link.id }">
						<div class="col-md-9">
							<h1 class="page-header">更新友情链接</h1>
							<div class="add-article-box">
								<h2 class="add-article-box-title">
									<span>名称</span>
								</h2>
								<div class="add-article-box-content">
									<input type="text" id="flink-name" name="name" value="${link.name }" class="form-control" placeholder="在此处输入名称" required autofocus autocomplete="off"> <span class="prompt-text">例如：听到微笑的技术博客</span>
								</div>
							</div>
							<div class="add-article-box">
								<h2 class="add-article-box-title">
									<span>WEB地址</span>
								</h2>
								<div class="add-article-box-content">
									<input type="text" id="flink-url" name="linkUrl" value="${link.linkUrl }" class="form-control" placeholder="在此处输入URL地址" required autocomplete="off"> <span class="prompt-text">例子：<code>http://www.tianjindong.cn/</code>——不要忘了<code>http://</code></span>
								</div>
							</div>
							<div class="add-article-box">
								<h2 class="add-article-box-title">
									<span>图像地址</span>
								</h2>
								<div class="add-article-box-content">
									<input id="imgurl" type="text" id="flink-imgurl" name="imgUrl" value="${link.imgUrl }" class="form-control" placeholder="在此处输入图像地址或在下面操作框中上传图片" required autocomplete="off" > <span class="prompt-text">图像地址是可选的，可以为网站LOGO地址等（不要忘了<code>http://</code>）
									</span> <input id="fileinput" type="file" class="file" name="uploadFile" multiple />
								</div>
							</div>
							<div class="add-article-box">
								<h2 class="add-article-box-title">
									<span>描述</span>
								</h2>
								<div class="add-article-box-content">
									<textarea class="form-control" name="description" autocomplete="off">${link.description }</textarea>
									<span class="prompt-text">描述是可选的手工创建的内容总结</span>
								</div>
							</div>
						</div>
						<div class="col-md-3">
							<h1 class="page-header">操作</h1>
							<div class="add-article-box">
								<h2 class="add-article-box-title">
									<span>保存</span>
								</h2>
								<div class="add-article-box-content">
									<p>
										<label>更新时间：</label> <span class="article-time-display"> <input id="time" style="border: none;" type="datetime"  />
										</span>
									</p>
								</div>
								<div class="add-article-box-footer">
									<button class="btn btn-primary" type="submit" name="submit">更新</button>
								</div>
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>
	</section>
	<script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
	<script src="${pageContext.request.contextPath }/js/admin-scripts.js"></script>
	<script src="${pageContext.request.contextPath }/js/fileinput.min.js"></script>
	<script src="${pageContext.request.contextPath }/js/zh.js"></script>
	<script type="text/javascript">
		$(function() {
			$("#flink").addClass('active');
	
			//显示时间
			var date = new Date();
			var dateInfo = "";
			dateInfo += date.getFullYear() + "年";
			dateInfo += (date.getMonth() + 1) + "月";
			dateInfo += date.getDate() + "日";
			$("#time").val(dateInfo);
		})
	
		$("#fileinput").fileinput({
			language : 'zh', //设置文中文
			uploadUrl : "${pageContext.request.contextPath }/upload.action", // 文件上传路径
			autoReplace : true, //重新选择时，自动替换当前文件
			uploadAync : true, //是否异步上传
			previewFileType : 'image', //预览的文件类型，支持video、pdf、img、txt等
			allowedFileExtensions : [ 'jpg', 'jpeg', 'png', 'gif' ], //允许上传的文件拓展名，数组，如果设置为png，那么jpg就不能上传
			maxFileSize : 5000, //上传文件的最大size
			maxFilePreviewSize : 5000, // 25 MB           //支持预览文件的最大size
			minFileCount : 1, //最小文件上传数量
			maxFileCount : 1, //最大文件上传数量
		});
	
	
		//文件上传成功后
		$("#fileinput").on("fileuploaded", function(event, data, previewId, index) {
			//event当前事件，data则是数据，包括上传后服务器返回的数据+ 自身的一些数据
			//data.response才为服务器返回的数据，如果是data.filenames则为当前要上传的文件名(不包括上传的)
			//previewId 预览的下标，从0开始计算，注意并不是数字，而是一串字符串 + _index
			//index 下标，预览下标与index不一致，因为当你导入sortable.js可以排序就可能会不一致
			$("#imgurl").val(data.response.data[0]);
			$("#imgurl").attr("readonly", "readonly");
		});
	</script>
</body>
</html>